<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<div class="bs-example1" data-example-id="contextual-table">
<!-- ToolBar -->
<nav class="navbar navbar-default">
  <div class="container-fluid">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
    </div>
    <!-- Collect the nav links, forms, and other content for toggling -->
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
    <!-- ToolBar -->
     <div class="btn-group nav navbar-nav" role="group">
		  <button type="button" class="btn btn-primary navbar-btn" onclick="addItem();">
		  	<span class="glyphicon glyphicon-plus" aria-hidden="true"></span>增加
		  </button>
		  <button type="button" class="btn btn-info  navbar-btn" onclick="updateItem();">
		  	<span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>修改
		  </button>
		  <button type="button" class="btn btn-danger navbar-btn" onclick="deleteItem();">
		  	<span class="glyphicon glyphicon-trash" aria-hidden="true"></span>删除
		  </button>
	 </div>
       <!--  <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>
          <ul class="dropdown-menu">
            <li><a href="#">Action</a></li>
            <li><a href="#">Another action</a></li>
            <li><a href="#">Something else here</a></li>
            <li role="separator" class="divider"></li>
            <li><a href="#">Separated link</a></li>
            <li role="separator" class="divider"></li>
            <li><a href="#">One more separated link</a></li>
          </ul>
        </li> -->
      <form class="navbar-form navbar-right">
        <div class="form-group">
          <input type="text" class="form-control1" placeholder=".col-md-10" style="height:34px;" >
        </div>
        <button type="submit" class="btn btn-default">
        	<span class="glyphicon glyphicon-search" aria-hidden="true"></span>	查询
        </button>
      </form>
      
    </div><!-- /.navbar-collapse -->
  </div><!-- /.container-fluid -->
</nav>
<!-- MainTable -->
	<table class="table">
		<thead>
			<tr>
				<th><input type="checkbox" id="checkAll" class="fa_check"></th>
				<th>ID</th>
				<th>用户名</th>
				<th>姓名</th>
				<th>地址</th>
				<th>角色</th>
			</tr>
		</thead>
		<!-- 动态加载数据 -->
		<tbody>
			
		</tbody>
		<!-- 加载分页 -->
		<tfoot>
			
		</tfoot>
	</table>
</div>
<input type="hidden" id="page" value="1"/>
<script>
/*预加载*/
$(document).ready(function() {
	loadItems({"pageBean.page":1,"pageBean.pageSize":10});
});
/*增加对象*/
function addItem(){
	//iframe窗
	layer.open({
	      type: 2,
	      title: '添加用户',
	      shadeClose: true,
	      shade: false,
	      maxmin: true, //开启最大化最小化按钮
	      area: ['800px', '600px'],
	      content: '${pageContext.request.contextPath}/admin/mune/modify_user.jsp'
	    });
}
/*修改对象*/
function updateItem(){
	var users = loadCheck();
	if(users.length == 1){
		//iframe窗
		layer.open({
		      type: 2,
		      title: '修改用户',
		      shadeClose: true,
		      shade: false,
		      maxmin: true, //开启最大化最小化按钮
		      area: ['800px', '600px'],
		      content: '${pageContext.request.contextPath}/admin/mune/modify_user.jsp?userId='+users[0]
		    });
	}else{
		mes("修改只能选择一个对象");
	}
}
/*批量删除对象*/
function deleteItems(){
	mes("删除对象");
}
/*加载对象*/
function loadItems(parms){
	var ii = layer.load(2,{//设置遮罩层
		  shade: [0.3] //0.1透明度的白色背景
	});
	$.post("${pageContext.request.contextPath}/user/user_list.action",parms,function(res){
		/*成功则动态构建html*/
		if(res.success){
			$('#page').val(res.page);					//设置当前页为隐藏表单
			var html = "";
			for(var i = 0;i < res.list.length;i++){
				var user = res.list[i];
				html += "<tr class=\""+((user.userType == 1)?"info":((user.userType == 2)?"danger":((user.userType == 3)?"success":"warning")))+"\">"
					  + "<th scope=\"row\">"
					  + "<input type='checkbox' class='list-check' name='subBox'  value=\""+user.userId+"\"/>"
					  + "<td>"+user.userId+"</td>"
					  + "<td>"+user.userName+"</td>"
					  + "<td>"+user.lastName+"  "+user.firstName+"</td>"
					  + "<td>"+user.address+"</td>"
					  + "<td>"+((user.userType == 2)?("社区服务者--"+user.role.roleName):user.role.roleName)+"</td>"
					  + "</tr>";
			}
			$("tbody").html(html);
			//给所有单选框注册监听事件
			checkAll();
			//计算尾部分页
			$("tfoot").html(paging(res.total,res.page,6));
			//关闭遮罩层
			layer.close(ii);
		}
	},"json");
}
/*跳页*/
function toPage(page){
	loadItems({"pageBean.page":page,"pageBean.pageSize":10});
}
/*批量删除对象*/
function deleteItem(){
	var userIds =  loadCheck();
	if(userIds.length > 1 ){
		var ii = layer.load(2,{//设置遮罩层
			  shade: [0.3] //0.1透明度的白色背景
		});
		var ids = "";
		for(var i = 0;i < userIds.length; i++){
			if(i == 0) ids += userIds[i];
			else ids += ","+userIds[i];
		}
		$.post("${pageContext.request.contextPath}/user/user_delete.action",{
			"ids" : ids
		},function(res){
			if(res.success){
				mes("删除<font style=\"color:red;\">"+userIds.length+"</font>条数据成功");
				toPage($("#page").val());
			}else{
				mes("删除失败请联系管理员!");
			}
			//关闭遮罩层
			layer.close(ii);
		},"json");
	}else{
		mes("请至少选择一个对象!");
	}
}
</script>